<template>
  <a-radio-group v-model="val" @change="change" button-style="solid">
    <template v-if="isObjList">
      <a-radio-button v-for="option in options" :value="option.value" :key="option.value">{{option.label}}</a-radio-button>
    </template>
    <template v-else-if="isStrList">
      <a-radio-button v-for="option in options" :value="option" :key="option">{{option}}</a-radio-button>
    </template>
  </a-radio-group>
</template>

<script>
export default {
  props: {
    options: {
      type: Array,
      default: () => []
    }
  },
  data () {
    return {
      val: ''
    };
  },
  created () {
    this.val = this.isObjList ? this.options[0].value : this.options[0];
  },
  methods: {
    change () {
      this.$emit(
        'change',
        this.isObjList
          ? this.val
          : this.options.findIndex(item => item === this.val) + 1
      );
    }
  },
  computed: {
    isObjList () {
      return this.options.every(
        item =>
          typeof item === 'object' &&
          // eslint-disable-next-line no-prototype-builtins
          item.hasOwnProperty(label) &&
          // eslint-disable-next-line no-prototype-builtins
          item.hasOwnProperty(value)
      );
    },
    isStrList () {
      return this.options.every(item => typeof item === 'string');
    },
    name () {
      return this.isObjList ? this.val.value : this.val;
    }
  }
};
</script>
